<template>
    <div>
        <div class="lists" v-for="(item,index) of lists" :key="index">
            <div class="moviecontainer">
                <MovieItem :movies="item" v-for="item,index of item.res" :key="index"></MovieItem>
            </div>
        </div>
    </div>
</template>

<script>
import MovieItem from '../../components/MovieItem';
    import { getMovie } from "../../model/moviehttp";
    export default {
        components:{MovieItem},
        data(){
            return{
                lists:{},
            }
        },
        methods: {
        },
        async mounted() {
            var https = [{"top250":"top250"},{"comingSoon":"即将上映"},{"inTheaters":"正在热映"}];
            var lists = {};
            for(let item of https){
                var key = Object.keys(item)[0];
                // console.log(key)
                var res = await getMovie(key);
                // console.log(res.data.res.slice(0,3))
                lists[key]={
                    res:res.data.res,
                    title:item[key]
                }
            }
            this.lists = lists
            // console.log(lists)
            // var listsUrl = "/article";
            // getArticle(listsUrl).then(res=>{
            //     this.lists = res.data.res
            //     this.swiper = res.data.res.slice((this.lists.length-3),(this.lists.length))
            // })
        },
    }
</script>

<style scoped>
.lists{
width: 90%;
margin:10px auto;
text-align: center;
}
</style>